﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ClassroomPerformance.aspx.cs" Inherits="XHCTMS.VIEW.ClassroomPerformance" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        
                .ui-button-text
        {
            font-size:10px;
        }
                .selecte
        {
            outline:none;
            width:158px;
            position:relative;
            float:left;
            margin:0px;
            padding:0px;
            font-size:10px;
        }
        .selecte ul
        {
            z-index:2;
            display:none;
            alpha(opacity=80); 
            opacity: 0.8;
            width:180px;
            position:absolute;
            border:1px solid #D2D5D8;
            margin-top:0px;
            background-color:#e8f5fe;
            padding-left:0px;
        }
        .selecte p
        {
            background:#FFFFFF;
            margin:0px;
            padding:2px 6px;
            width:168px;
            height:12px;
            line-height:14px;
            border:1px solid #D2D5D8;
            cursor:default;
        }
        .selecte ul li
        {
            text-indent:10px;
            list-style:none;
        }
        .selecte ul li a
        {
            cursor:default;
            height:20px;
            line-height:20px;
            display:block;
            text-decoration:none;
            color:Black;
        }
        .selecte ul li a:hover
        {
            background:Blue;
        }
                #GridView table tbody tr td
        {
            border-bottom:1px solid #D2D5D8;
            border-top:1px solid #D2D5D8;
            padding:3px 6px;
            font-size:12px;
            color:#333333;
        }
        #GridView table thead tr td
        {
            width:200px;
            border-bottom:2px solid #888888;
            font-size:13px;
            font-weight:bold;
            color:#333333;
            padding:3px 6px;
            background-color:#BBBBBB;
        }
         #GridView table
        {
            border-collapse: collapse;
            width:100%;
            border:1px solid #D2D5D8;
            cursor:default;
        }
         #GridView table tbody tr td input
        {
            border:1px solid #D2D5D8;
            height:12px;
            font-size:12px;
            width:100px;
            outline:none;
        }
        #atitel:hover
        {
            background-color:#90ACC6;
        }
        
        
        #Grade
        {
            display:none;
        }
        
        #submit
        {
            float:right;
        }
        
        #submitserver
        {
            display:none;
        }
    </style>
    <link href="css/custom-theme/jquery-ui-1.8.13.custom.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.6.2.min.js" type="text/javascript"></script>
    <script src="js/jquery-ui-1.8.13.custom.min.js" type="text/javascript"></script>
    <script src="js/date.js" type="text/javascript"></script>
    <script type="text/javascript">
        (function ($) {
            $.fn.grid = function () {
                $(this)
            .click(function () {
                var gr = $(this).next("div");
                if (gr.css("display") == "none") {
                    $(this).find("span").removeClass("ui-icon ui-icon-triangle-1-s");
                    $(this).find("span").addClass("ui-icon ui-icon-triangle-1-n");
                    gr.slideDown(360);
                }
                else {
                    $(this).find("span").removeClass("ui-icon ui-icon-triangle-1-n");
                    $(this).find("span").addClass("ui-icon ui-icon-triangle-1-s");
                    gr.slideUp(360);
                }

            }).mouseout(function () {
                $(this).css("background-color", ""); //99CCFF
            })
            .mousemove(function () {
                $(this).css("background-color", "#86A3BD");
            })
            }
    })(jQuery)


    $(function () {
        $("#GridView table tr td").live({ mouseenter: function () {
            $(this).parent().css("background-color", "#99CCFF");
        }, mouseleave: function () {
            $(this).parent().css("background-color", "");
        }
        })

        $("#operate").grid();

        $("#grid").grid();

        $("#submit").mouseenter(function () {
            $(this).css("color", "red");
        })
        .mouseleave(function () {
            $(this).css("color", "");
        });

        $(".selecte p").append('<span style="float:right;" class="ui-icon ui-icon-triangle-1-s"></span>');
        //判断下拉菜单打开和关闭
        $(".selecte p").bind("selectstart", function () {
            return false;
        })
            .live("click", function () {
                var spans = $(this).find("span");
                var ul = $(this).next("ul");
                if (ul.css("display") == "none") {
                    $(this).parent().attr("tabindex", 0).focus();
                    ul.slideDown(360);
                    spans.removeClass("ui-icon ui-icon-triangle-1-n");
                    spans.addClass("ui-icon ui-icon-triangle-1-s");
                    $(this).parent().blur(function () {
                        ul.slideUp(360);
                        spans.removeClass("ui-icon ui-icon-triangle-1-s");
                        spans.addClass("ui-icon ui-icon-triangle-1-n");
                    })
                }
                else {
                    ul.slideUp(360);
                    spans.removeClass("ui-icon ui-icon-triangle-1-s");
                    spans.addClass("ui-icon ui-icon-triangle-1-n");
                }
            });

        $(".selecte ul li a").live("click", function (e) {
            $(this).parents("ul").hide();
            $(this).parents("ul").prev().html($(this).text() + '<span style="float:right;" class="ui-icon ui-icon-triangle-1-s"></span>').attr("id", $(this).attr("rel"));
        })


        var isnull = true;
        $("#GridView tbody tr td:last-child").click(function () {
            if (isnull) {
                isnull = false;
                //alert($(this).parent().index());
                //                var id = $.trim($(this).parent().find("td:eq(0)").text());
                var text = $(this).text();
                $(this).text("").append('<div id="Div1" class="selecte"><p>请选择职称<span style="float:right;" class="ui-icon ui-icon-triangle-1-s"></span></p><ul><li><a>优秀</a></li><li><a>良好</a></li><li><a>三无</a></li><li><a>作业未完成或未达标</a></li><li><a>睡觉、玩手机、玩游戏</a></li><li><a>听音乐、看电影、看小说</a></li><li><a>扰乱纪律</a></li><li><a>顶撞老师</a></li></ul></div>');
                $(this).find("p").text(text).append('<span style="float:right;" class="ui-icon ui-icon-triangle-1-s"></span>').parent().attr("tabindex", 0)
                .focus()
                .keydown(function (e) {
                    var f = e.which;
                    if (f == 9) {
                        isnull = true;
                        $(this).parents("tbody").next().find("tr td:last").text($(this).find("p").text()).trigger("click");
                        isnull = false;
                        return false;
                    }
                })
                .blur(function () {
                    $(this).parent().text($(this).find("p").text());
                    //$("#Grade").val($("#Grade").val() + ":" + id + ":" + $(this).find("p").text() + ":");
                    $(this).remove();
                    isnull = true;
                });
            }
        })


        $("#submitserver").click(function () {
            var $StudentsId = $("#GridView tbody tr td:first-child");
            var $Scores = $("#GridView tbody tr td:last-child");
            var j = $StudentsId.size();
            var StudentsScores = "";
            for (var i = 0; i < j; i++) {
                StudentsScores += $.trim($StudentsId.eq(i).text()) + ":" + $.trim($Scores.eq(i).text()) + ":";
            }
            $("#Grade").val(StudentsScores);
        })

        $("#submit").click(function () {

            $("<div>确认提交</div>").dialog({ buttons: {
                "是": function () {
                    $("#submitserver").trigger("click");
                },
                "否": function () {
                    $(this).dialog("close");
                    return false;
                }
            }
            })

            return false;

        })

    })
    </script>
</head>
<body>
<form runat="server">
<div style="background-color: #F1F1F1">
    <div id="accordion">
    
        <h4 id="grid" style="line-height:30px; cursor:default; border:1px solid #D2D5D8;"><a style="background-color:#86A3BD; height:5px; display:block"></a>学生信息<span class="ui-icon ui-icon-triangle-1-n" style=" margin-top:8px; float:right"></span></h4>
        <div id="grids" style=" display:block; border:1px solid #D2D5D8; height:100%">
             <div id="GridView" style="margin-top:10px; padding:10px;">                 
                 <table>
                 <asp:Repeater ID="StudentView" runat="server">
                 <HeaderTemplate>
                 <thead><tr><td>学号</td><td>姓名</td><td>操作</td></tr></thead>
                 </HeaderTemplate>
                 <ItemTemplate>
                 <tbody>
                     <tr>
                         <td>
                             <%# Eval("xhstudent_id") %>
                         </td>
                         <td>
                             <%# Eval("student_name") %>
                         </td>
                         <td>正常</td>
                     </tr>
                 </tbody>
                 </ItemTemplate>
                 </asp:Repeater>
                 </table>
             </div>
             <div style=" margin-bottom:5px; padding:3px 9px; border:1px solid #D2D5D8; margin-left:10px; margin-right:10px; height:25px; line-height:18px;">
                 <asp:Button ID="submitserver" runat="server" CommandArgument="1" 
                     onclick="submit_Click" Text="提交" CssClass=" dialog_link ui-state-default ui-corner-some floatRight" TabIndex="1000" />
                     <button id="submit" class="dialog_link ui-state-default ui-corner-some floatRight">提交</button>
                 <asp:TextBox
                         ID="Grade" runat="server">语文</asp:TextBox>
                         </div>
        </div>
    </div>
</div>
</form>
</body>
</html>
